<template>
	<view>
		<u-loading-page :loading="loadding" loading-mode="semicircle" loading-text="Hello Pro"></u-loading-page>
		<view class="main" v-if="!loadding">
			<view v-if="data.length > 0" class="lists">
				<view class="item" v-for="(item, index) in data" :key="index">
					<view class="con">
						<u-icon name="account" size="20" color="#2979ff"></u-icon>
						<text class="phone">{{item.phone}}</text>
					</view>
					<text>已达标</text>
				</view>
			</view>
			<u-empty v-else mode="list" icon="/static/Empty/data_null.png">
			</u-empty>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				loadding: true,
				userinfo: {},
				levs: null,
				times: null,
				data: []
			}
		},
		onLoad(e) {
			this.userinfo = uni.getStorageSync('userinfo');
			this.levs = e.levs
			this.times = e.times
			this.loadData()
		},
		methods: {
			async loadData() {
				const {
					data: res
				} = await this.$myHttp5({
					url: 'Bonus/stands_details',
					data: {
						levs: this.levs,
						times: this.times
					},
					header: {
						'token': this.userinfo.token
					},
				});
				this.loadding = false
				this.data = res.data
			},
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #f3f4f6;
	}
	.main {
		.lists {
			padding: 30rpx;
			
			.item {
				background-color: #ffffff;
				padding: 30rpx;
				display: flex;
				font-weight: bold;
				border-radius: 10rpx;
				justify-content: space-between;
				
				.con {
					display: flex;
					justify-content: flex-start;
					
					.phone {
						padding-left: 10rpx;
					}
				}
			}
		}
	}
</style>
